<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>SIMPLE SYNTAX TEST</title>
    <script type="text/javascript" src="../../dist/index.web.min.js"></script>
  </head>
  <body>
    <div id="root"></div>
    <script type="text/javascript">
      const JXM = {
        main:{
          debug:true,
          props:{
            key:121
          },
          children:[
            {
              header:{
                props:{
                  id:'docTitle',
                  style:{
                    fontWeight:'bold',
                    color:'blue'
                  },
                  key:434343
                },
                windowprops:{
                  children:['document','title']
                }
              }
            },
            {
              div:{
                props:{
                  title:'this is a passed Title',
                  key:121234343
                },
                passprops:true,
                children:[
                  { p:{childre:'super short',props:{key:90293}}},
                  { ul:{
                    props:{key:1212},
                    children:[{li:{children:'first',props:{key:442}}},{li:{children:'second',props:{key:121}}}]}
                    },
                  {
                    p:{
                      props:{
                        "data-is-loading":true,
                        key:124,
                      },
                      children:'should have passed props'
                    }
                  },
                  {
                    component:'p',
                    props:{
                      key:456
                    },
                    children:'mixed usage with regular syntax'
                  }
                ]
              }
            }
          ]
        }
      }
      const boundConfig = {
       
      };
      jsonx.jsonxRender.call(boundConfig,{ 
        jsonx: JXM, 
        querySelector:'#root', });
    </script>
  </body>
</html>